<!doctype HTML>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1" />
<title>ThinkPHP登录模块</title>

<style>
body {
color: #333;
font-family: sans-serif;
font-size: 12pt;
line-height: 170%;
padding: 0 30px 0 270px;
}

header .banner {
margin: 0 0 1em 0;
}

header .banner, nav .banner {
color: #777;
font-size: 10pt;
font-weight: bold;
}

header h1 {
background: #0c3;
border-radius: 4px;
color: #fff;
font-size: 24pt;
margin: 0;
padding: 1.2em 0;
text-align: center;
}

nav {
font-size: 10pt;
overflow-x: auto;
overflow-y: auto;
position: fixed;
top: 0;
left: 0;
bottom: 0;
width: 240px;
}

nav .menubar {
border-bottom: solid 1px #ccc;
display: none;
height: 48px;
line-height: 48px;
padding: 0 10px;
}

nav .button {
background: #777;
border: 1px solid #333;
color: #fff;
font-size: 10pt;
font-weight: bold;
padding: 8px;
border-radius: 4px;
}

nav ul {
padding: 0 0 0 10px;
}

nav ul a {
color: #333;
text-decoration: none;
}

nav ul a:hover {
text-decoration: underline;
}

nav li {
line-height: 180%;
list-style: none;
margin: 0;
padding: 0;
}

nav .level2 {
font-size: 11pt;
font-weight: bold;
}

nav .level3 {
padding-left: 1em;
}

nav .level3:before { 
content: "» ";
}

nav .level4 {
padding-left: 2em;
}

nav .level4:before {
content: "› ";
}

article h2 {
border-bottom: dotted 1px #777;
font-size: 36px;
line-height: 100%;
margin: 2em 0 1em 0;
height:50px;
line-height: 50px;
}

article h3 {
font-size: 30px;
height:30px;
line-height: 30px;
padding-left:5px;
color:#f94108;

}

article h4 {
font-size: 12pt;
font-style:bold;
font-weight: normal;
height:24px;
line-height:24px;
margin: 1.2em 0 1em 0;
padding: 10px;
color:#FFFFFF;
background:#f94108;
}

article p {
margin: 1em 0;
}

article p code {
background: #eee;
border: 1px solid #ccc;
}

article p strong {
color: #f00;
}

article pre {
background: #eee;
border-left: solid 3px #3c0;
font-size: 10pt;
line-height:16px;
margin: 1em 0;
padding: 0 0 0 1em;
overflow-x: auto;
overflow-y: padding;
}

article blockquote {
background: #fff;
border: dashed 1px #777;
border-left: solid 2px #777;
color: #000;
margin: 0;
padding: 0 0 0 1em;
}

article ul, article ol {
padding-left: 2em;
}

article img{}

footer {
border-top: 1px solid #ccc;
font-size: 10pt;
margin-top: 4em;
}

@media (max-width: 768px) {

body {
padding: 0 10px 0 230px;
}

nav {
width: 230px;
}

}

@media (max-width: 480px) {

body {
padding: 64px 10px 0 10px;
}

header .banner {
display: none;
}

nav {
position: absolute;
width: 100%;
}

nav .menubar {
display: block;
}

nav .banner {
float: right;
}

nav ul {
background: #fff;
display: none;
font-size: 14pt;
margin: 0;
padding: 0 0 0 8px;
}

nav .level2 {
font-size: 16pt;
font-weight: bold;
}

nav li {
line-height: 240%;
}

.index nav ul {
display: block;
}

.index article {
display: none;
}

}
</style>
<script>
  (function (tags) {
    var i = 0, len = tags.length;

    for (; i < len; ++i) {
        document.createElement(tags[i]);
    }
  }([ 'header', 'nav', 'article', 'footer' ]));
</script>
</head>
<body>
<header>
<h1 id="-thinkphp-">龙之翼 ThinkPHP模块分析 开发文档</h1>

</header>
<nav>
<div class="menubar">
<a class="button">&#9776;&nbsp;索引</a>
</div>
<ul>
<li class="level2"><a href="#1">登录结构图</a></li><li class="level3"><a href="#1.1">结构图</a></li><li class="level2"><a href="#2">数据表</a></li><li class="level3"><a href="#2.1">pre_user</a></li><li class="level2"><a href="#3">登录模块</a></li><li class="level3"><a href="#3.1">LoginController.class.php</a></li><li class="level3"><a href="#3.2">login.html(精简版)</a></li><li class="level3"><a href="#3.3">login.html(完整版)</a></li><li class="level2"><a href="#4">登录模块</a></li><li class="level3"><a href="#4.1">LoginController.class.php</a></li><li class="level3"><a href="#4.2">login.html(精简版)</a></li><li class="level3"><a href="#4.3">login.html(完整版)</a></li><li class="level2"><a href="#5">登录模块</a></li><li class="level3"><a href="#5.1">暂无</a></li><li class="level2"><a href="#6">登录模块-代码分析</a></li><li class="level3"><a href="#6.1">LoginController.class.php</a></li><li class="level4"><a href="#6.1.1">login.html(ajax精简版)</a></li><li class="level4"><a href="#6.1.2">login.html(ajax完整版)</a></li><li class="level4"><a href="#6.1.3">login.html(form传参精简版)</a></li><li class="level3"><a href="#6.2">login.html(form完整版)</a></li></ul>

</nav>
<article>

<h2 id="1">登录结构图</h2>
<p>登录模块是一个后台的核心，有的人虽然说是简单，但是它却囊括了众多的知识点！其实总的来说，它很复杂。为什么这么说呢？
其实它包含三大部分：
1、普通登录
2、AJAX登录
3、记住密码登录
4、QQ、微博、微信绑定登录（这里暂不做记载）</p>
<h3 id="1.1">结构图</h3>
<p>可以明显看到，就两个文件!</p>
<pre><code>├─Application
│  ├─Admin
│  │  ├─Controller
│  │  │      LoginController.class.php
│  │  │      
│  │  └─View
│  │      ├─Login
│  │      │      login.html</code></pre>

<h2 id="2">数据表</h2>
<p>总共涉及到一个数据表</p>
<h3 id="2.1">pre_user</h3>

<h2 id="3">登录模块</h2>
<h3 id="3.1">LoginController.class.php</h3>
<p>位置：/Application/Admin/Controller/LoginController.class.php  </p>
<pre><code>&lt;?php

namespace Admin\Controller;
use Think\Verify;

class LoginController extends BaseController {

    /*
     * 管理员登陆
     */
    public function login() {

        if (session(&#39;?admin_id&#39;) &amp;&amp; session(&#39;admin_id&#39;) &gt; 0) {
            $this -&gt; error(&quot;您已登录&quot;, U(&#39;Admin/Index/index&#39;));
        }

        if (IS_POST) {
            $verify = new Verify();
            if (!$verify -&gt; check(I(&#39;post.vertify&#39;), &quot;Admin/Login&quot;)) {
                exit(json_encode(array(&#39;status&#39; =&gt; 0, &#39;msg&#39; =&gt; &#39;验证码错误2&#39;)));
            }
            $condition[&#39;user_name&#39;] = I(&#39;post.username&#39;);
            $condition[&#39;password&#39;] = I(&#39;post.password&#39;);
            if (!empty($condition[&#39;user_name&#39;]) &amp;&amp; !empty($condition[&#39;password&#39;])) {
                $condition[&#39;password&#39;] = encrypt($condition[&#39;password&#39;]);
                $admin_info = M(&#39;admin&#39;) -&gt; join(&#39;__ADMIN_ROLE__ ON __ADMIN__.role_id=__ADMIN_ROLE__.role_id&#39;) -&gt; where($condition) -&gt; find();
                if (is_array($admin_info)) {
                    session(&#39;admin_id&#39;, $admin_info[&#39;admin_id&#39;]);
                    session(&#39;act_list&#39;, $admin_info[&#39;act_list&#39;]);
                    $last_login_time = M(&#39;admin_log&#39;) -&gt; where(&quot;admin_id = &quot; . $admin_info[&#39;admin_id&#39;] . &quot; and log_info = &#39;后台登录&#39;&quot;) -&gt; order(&#39;log_id desc&#39;) -&gt; limit(1) -&gt; getField(&#39;log_time&#39;);
                    session(&#39;last_login_time&#39;, $last_login_time);
                    adminLog(&#39;后台登录&#39;, __ACTION__);
                    $url = session(&#39;from_url&#39;) ? session(&#39;from_url&#39;) : U(&#39;Admin/Index/index&#39;);
                    exit(json_encode(array(&#39;status&#39; =&gt; 1, &#39;url&#39; =&gt; $url)));
                } else {
                    exit(json_encode(array(&#39;status&#39; =&gt; 0, &#39;msg&#39; =&gt; &#39;账号密码不正确&#39;)));
                }
            } else {
                exit(json_encode(array(&#39;status&#39; =&gt; 0, &#39;msg&#39; =&gt; &#39;请填写账号密码&#39;)));
            }
        }

        $this -&gt; display();
    }

    /**
     * 验证码获取
     */
    public function vertify() {
        $config = array(&#39;fontSize&#39; =&gt; 30, &#39;length&#39; =&gt; 4, &#39;useCurve&#39; =&gt; true, &#39;useNoise&#39; =&gt; false, );
        $Verify = new Verify($config);
        $Verify -&gt; entry(&quot;Admin/Login&quot;);
    }

}</code></pre>
<h3 id="3.2">login.html(精简版)</h3>
<p>图示：<br><img src="images/login02.png" alt=""> </p>
<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta charset=&quot;UTF-8&quot;&gt;
        &lt;title&gt;龙之翼后台登陆&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;input type=&quot;text&quot; name=&quot;username&quot; id=&quot;username&quot; placeholder=&quot;账号&quot; /&gt;
        &lt;input type=&quot;password&quot; name=&quot;password&quot; id=&quot;password&quot; placeholder=&quot;密码&quot; /&gt;
        &lt;input type=&quot;text&quot; name=&quot;vertify&quot; placeholder=&quot;验证码&quot; /&gt;
        &lt;img id=&quot;imgVerify&quot; style=&quot;cursor:pointer;&quot; src=&quot;{:U(&#39;Login/vertify&#39;)}&quot; onclick=&quot;fleshVerify();&quot; /&gt;
        &lt;button type=&quot;button&quot; class=&quot;btn btn-primary btn-block btn-flat&quot; onclick=&quot;checkLogin()&quot;&gt;立即登陆 &lt;/button&gt;    
        &lt;script src=&quot;http://libs.baidu.com/jquery/2.0.0/jquery.min.js&quot;&gt;&lt;/script&gt;
        &lt;script&gt;
            function fleshVerify() {
                //重载验证码
                $(&#39;#imgVerify&#39;).attr(&#39;src&#39;, &#39;/index.php?m=Admin&amp;c=Login&amp;a=vertify&amp;r=&#39; + Math.floor(Math.random() * 100));
            }
            function checkLogin() {
                var username = $(&#39;#username&#39;).val();
                var password = $(&#39;#password&#39;).val();
                var vertify = $(&#39;input[name=&quot;vertify&quot;]&#39;).val();
                if (username == &#39;&#39; || password == &#39;&#39;) {
                    alert(&#39;用户名或密码不能为空&#39;);
                    return;
                }
                if (vertify == &#39;&#39;) {
                    alert(&#39;验证码不能为空&#39;);
                    return;
                }
                if (vertify.length != 4) {
                    alert(验证码错误);
                    return;
                }
                $.ajax({
                    url: &#39;/index.php?m=Admin&amp;c=Login&amp;a=login&amp;t=&#39; + Math.random(),
                    type: &#39;post&#39;,
                    dataType: &#39;json&#39;,
                    data: {
                        username: username,
                        password: password,
                        vertify: vertify
                    },
                    success: function(res) {
                        if (res.status == 1) {
                            top.location.href = res.url;
                            } else {
                            alert(res.msg);
                        }
                    },
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                        alert(&#39;网络失败，请刷新页面后重试&#39;);
                    }
                })
            }
        &lt;/script&gt;
    &lt;/body&gt;
&lt;/html&gt;</code></pre>
<h3 id="3.3">login.html(完整版)</h3>

<h2 id="4">登录模块</h2>
<h3 id="4.1">LoginController.class.php</h3>
<p>位置：/Application/Admin/Controller/LoginController.class.php  </p>
<h3 id="4.2">login.html(精简版)</h3>
<h3 id="4.3">login.html(完整版)</h3>

<h2 id="5">登录模块</h2>
<h3 id="5.1">暂无</h3>

<h2 id="6">登录模块-代码分析</h2>
<h3 id="6.1">LoginController.class.php</h3>
<p>位置：/Application/Admin/Controller/LoginController.class.php  </p>
<h4 id="6.1.1">login.html(ajax精简版)</h4>
<p>1.1<br>下边这段代码是检测浏览器的版本的！<br>代码如下：  </p>
<pre><code>function detectBrowser() {
    var browser = navigator.appName
    if (navigator.userAgent.indexOf(&quot;MSIE&quot;) &gt; 0) {?
        var b_version = navigator.appVersion
        var version = b_version.split(&quot;;&quot;);
        var trim_Version = version[1].replace(/[ ]/g, &quot;&quot;);
        if ((browser == &quot;Netscape&quot; || browser == &quot;Microsoft Internet Explorer&quot;)) {
            if (trim_Version == &#39;MSIE8.0&#39; || trim_Version == &#39;MSIE7.0&#39; || trim_Version == &#39;MSIE6.0&#39;) {
                alert(&#39;请使用IE9.0版本以上进行访问&#39;);
                return;
            }
        }
    }
}
detectBrowser();</code></pre>
<p>结果如图：<br><img src="images/login01.png" alt=""></p>
<p>1.2  bootstrap<br>说明：一个css和js开源框架  </p>
<p>1.3 AdminLTE.min.css
说明：基于Bootstrap的控制面板</p>
<p>1.4 blue.css
说明：</p>
<h4 id="6.1.2">login.html(ajax完整版)</h4>
<h4 id="6.1.3">login.html(form传参精简版)</h4>
<h3 id="6.2">login.html(form完整版)</h3>


</article>
<footer>
<p>© 2016 龙之翼网络科技</p>

</footer>
</body>
</html>
